// 当DOM加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
    // 初始化日志功能
    initDiary();
});

// 初始化日志功能
function initDiary() {
    // 初始化新日志表单
    initNewDiaryForm();
    
    // 初始化日志交互
    initDiaryInteractions();
}

// 初始化新日志表单
function initNewDiaryForm() {
    // 获取模态框元素
    const modal = document.getElementById('new-diary-modal');
    if (!modal) return;
    
    // 获取打开模态框的按钮
    const newDiaryBtn = document.getElementById('new-diary-btn');
    
    // 获取关闭按钮
    const closeBtn = modal.querySelector('.close');
    
    // 打开模态框
    if (newDiaryBtn) {
        newDiaryBtn.addEventListener('click', function() {
            modal.style.display = 'flex';
            document.body.style.overflow = 'hidden';
        });
    }
    
    // 关闭模态框
    if (closeBtn) {
        closeBtn.addEventListener('click', function() {
            modal.style.display = 'none';
            document.body.style.overflow = 'auto';
            resetDiaryForm();
        });
    }
    
    // 点击模态框外部区域关闭
    window.addEventListener('click', function(event) {
        if (event.target === modal) {
            modal.style.display = 'none';
            document.body.style.overflow = 'auto';
            resetDiaryForm();
        }
    });
    
    // 点击心情按钮
    const moodBtns = document.querySelectorAll('.mood-selector .mood-btn');
    moodBtns.forEach(btn => {
        btn.addEventListener('click', function() {
            // 移除其他按钮的选中状态
            moodBtns.forEach(b => b.classList.remove('active'));
            // 为当前按钮添加选中状态
            this.classList.add('active');
        });
    });
    
    // 处理照片上传
    const photoBtn = document.querySelector('.photo-upload button');
    const photoInput = document.querySelector('.photo-upload input[type="file"]');
    const photoPreview = document.querySelector('.upload-preview');
    
    if (photoBtn && photoInput) {
        photoBtn.addEventListener('click', function() {
            photoInput.click();
        });
        
        photoInput.addEventListener('change', function() {
            displayPhotoPreview(this.files);
        });
    }
    
    // 处理表单提交
    const publishBtn = modal.querySelector('.btn-primary');
    if (publishBtn) {
        publishBtn.addEventListener('click', function() {
            publishDiary();
        });
    }
    
    // 保存草稿
    const draftBtn = modal.querySelector('.btn-secondary');
    if (draftBtn) {
        draftBtn.addEventListener('click', function() {
            saveDiaryDraft();
        });
    }
}

// 显示照片预览
function displayPhotoPreview(files) {
    const previewContainer = document.querySelector('.upload-preview');
    if (!previewContainer) return;
    
    // 清空预览区域
    previewContainer.innerHTML = '';
    
    if (files.length === 0) return;
    
    // 为每个选择的文件创建预览
    Array.from(files).forEach(file => {
        if (!file.type.match('image.*')) return;
        
        const reader = new FileReader();
        const preview = document.createElement('div');
        preview.className = 'preview-item';
        
        reader.onload = function(e) {
            preview.innerHTML = `
                <img src="${e.target.result}" alt="预览">
                <button class="remove-preview" type="button"><i class="fas fa-times"></i></button>
            `;
            
            // 添加删除预览图片的功能
            const removeBtn = preview.querySelector('.remove-preview');
            removeBtn.addEventListener('click', function() {
                preview.remove();
            });
        };
        
        reader.readAsDataURL(file);
        previewContainer.appendChild(preview);
    });
}

// 发布日志
function publishDiary() {
    const modal = document.getElementById('new-diary-modal');
    
    // 获取表单数据
    const title = modal.querySelector('input[type="text"]').value;
    const content = modal.querySelector('textarea').value;
    const activeMood = modal.querySelector('.mood-selector .mood-btn.active');
    const privacy = modal.querySelector('select').value;
    
    // 表单验证
    if (!title || !content) {
        showNotification('请填写标题和内容', 'error');
        return;
    }
    
    if (!activeMood) {
        showNotification('请选择一种心情', 'error');
        return;
    }
    
    // 实际项目中，这里应该发送API请求保存日志
    // 这里只是模拟保存成功
    showNotification('日志发布成功！', 'success');
    
    // 关闭模态框
    modal.style.display = 'none';
    document.body.style.overflow = 'auto';
    
    // 重置表单
    resetDiaryForm();
    
    // 刷新日志列表或添加新日志（实际项目中可能需要重新获取数据）
    // 这里只是简单地重新加载页面
    setTimeout(() => {
        window.location.reload();
    }, 1500);
}

// 保存日志草稿
function saveDiaryDraft() {
    const modal = document.getElementById('new-diary-modal');
    
    // 获取表单数据
    const title = modal.querySelector('input[type="text"]').value;
    const content = modal.querySelector('textarea').value;
    
    // 在实际项目中，这里应该将草稿保存到本地存储或发送到服务器
    // 这里只是简单地显示通知
    showNotification('草稿已保存', 'info');
}

// 重置日志表单
function resetDiaryForm() {
    const modal = document.getElementById('new-diary-modal');
    if (!modal) return;
    
    // 重置标题和内容
    const titleInput = modal.querySelector('input[type="text"]');
    const contentTextarea = modal.querySelector('textarea');
    
    if (titleInput) titleInput.value = '';
    if (contentTextarea) contentTextarea.value = '';
    
    // 重置心情选择
    const moodBtns = modal.querySelectorAll('.mood-selector .mood-btn');
    moodBtns.forEach(btn => btn.classList.remove('active'));
    
    // 重置照片预览
    const previewContainer = modal.querySelector('.upload-preview');
    if (previewContainer) previewContainer.innerHTML = '';
    
    // 重置照片输入
    const photoInput = modal.querySelector('input[type="file"]');
    if (photoInput) photoInput.value = '';
}

// 初始化日志交互
function initDiaryInteractions() {
    // 点赞按钮
    const likeButtons = document.querySelectorAll('.btn-like');
    likeButtons.forEach(btn => {
        btn.addEventListener('click', function() {
            const countSpan = this.querySelector('span');
            const currentCount = parseInt(countSpan.textContent);
            
            // 切换点赞状态
            if (this.classList.contains('active')) {
                // 取消点赞
                this.classList.remove('active');
                countSpan.textContent = currentCount - 1;
            } else {
                // 添加点赞
                this.classList.add('active');
                countSpan.textContent = currentCount + 1;
            }
        });
    });
    
    // 评论按钮
    const commentButtons = document.querySelectorAll('.btn-comment');
    commentButtons.forEach(btn => {
        btn.addEventListener('click', function() {
            // 找到评论区域
            const commentsSection = this.closest('.entry-actions').nextElementSibling;
            
            // 切换评论区显示状态
            if (commentsSection.style.maxHeight) {
                commentsSection.style.maxHeight = null;
            } else {
                commentsSection.style.maxHeight = commentsSection.scrollHeight + 'px';
            }
        });
    });
    
    // 发送评论
    const commentForms = document.querySelectorAll('.add-comment');
    commentForms.forEach(form => {
        const textarea = form.querySelector('textarea');
        const submitBtn = form.querySelector('button');
        
        submitBtn.addEventListener('click', function() {
            if (textarea.value.trim() === '') return;
            
            // 添加评论
            const commentsContainer = this.closest('.entry-comments');
            addDiaryComment(commentsContainer, textarea.value);
            
            // 清空输入框
            textarea.value = '';
        });
        
        // 按下Enter键发送评论
        textarea.addEventListener('keydown', function(e) {
            if (e.key === 'Enter' && !e.shiftKey) {
                e.preventDefault();
                submitBtn.click();
            }
        });
    });
    
    // 分享按钮
    const shareButtons = document.querySelectorAll('.btn-share');
    shareButtons.forEach(btn => {
        btn.addEventListener('click', function() {
            // 实际项目中，这里应该实现分享功能
            // 例如复制链接、打开分享对话框等
            showNotification('分享功能正在开发中...', 'info');
        });
    });
    
    // 加载更多按钮
    const loadMoreBtn = document.querySelector('.load-more button');
    if (loadMoreBtn) {
        loadMoreBtn.addEventListener('click', function() {
            // 实际项目中，这里应该加载更多日志
            // 这里只是简单地显示通知
            showNotification('加载更多日志功能正在开发中...', 'info');
        });
    }
}

// 添加评论到评论区
function addDiaryComment(container, text) {
    // 创建评论元素
    const comment = document.createElement('div');
    comment.className = 'comment';
    
    // 获取当前用户信息（真实项目中应该从用户会话获取）
    // 这里简单假设是"小明"
    const user = {
        name: '小明',
        avatar: 'img/couples/boy.jpg'
    };
    
    // 获取当前日期
    const today = new Date();
    const dateString = formatDate(today);
    
    // 设置评论内容
    comment.innerHTML = `
        <div class="comment-avatar">
            <img src="${user.avatar}" alt="${user.name}">
        </div>
        <div class="comment-content">
            <h4>${user.name}</h4>
            <p>${text}</p>
            <span class="comment-date">${dateString}</span>
        </div>
    `;
    
    // 将评论添加到容器中
    const addCommentForm = container.querySelector('.add-comment');
    container.insertBefore(comment, addCommentForm);
    
    // 调整评论区高度
    const commentsSection = container;
    commentsSection.style.maxHeight = commentsSection.scrollHeight + 'px';
}

// 显示通知
function showNotification(message, type = 'info') {
    // 检查是否已存在通知容器
    let notificationContainer = document.querySelector('.notification-container');
    
    // 如果不存在，创建一个
    if (!notificationContainer) {
        notificationContainer = document.createElement('div');
        notificationContainer.className = 'notification-container';
        document.body.appendChild(notificationContainer);
    }
    
    // 创建通知元素
    const notification = document.createElement('div');
    notification.className = `notification ${type}`;
    notification.innerHTML = `
        <div class="notification-content">
            <i class="fas ${getIconForType(type)}"></i>
            <span>${message}</span>
        </div>
    `;
    
    // 添加到容器
    notificationContainer.appendChild(notification);
    
    // 动画显示
    setTimeout(() => {
        notification.classList.add('show');
    }, 10);
    
    // 几秒后自动消失
    setTimeout(() => {
        notification.classList.remove('show');
        setTimeout(() => {
            notification.remove();
        }, 300);
    }, 3000);
    
    // 获取通知类型对应的图标
    function getIconForType(type) {
        switch(type) {
            case 'success': return 'fa-check-circle';
            case 'error': return 'fa-exclamation-circle';
            case 'warning': return 'fa-exclamation-triangle';
            default: return 'fa-info-circle';
        }
    }
}

// 格式化日期
function formatDate(date) {
    const year = date.getFullYear();
    const month = date.getMonth() + 1;
    const day = date.getDate();
    
    return `${year}年${month}月${day}日`;
} 